<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Document</title>
  </head>
  <body>
    <button id="btn">按钮1</button>
    <button id="btn">按钮2</button>
    <button id="btn">按钮3</button>
    <button id="btn">按钮4</button>
    <script>
      //  this关键字 指向，谁调用就指向谁

      //   普通函数内部    一般执行的时候都是window去执行的
      //   function fun() {
      //     console.log(this);
      //   }
      //   fun();

      //   function f1() {
      //     function f2() {
      //       console.log(this);
      //     }
      //     f2();
      //   }
      //   f1();

      //   方法内部   一般调用的时候执行者都是这个方法的对象
      //   var cat = {
      //     name: "旺仔",
      //     age: 2,
      //     eat: function () {
      //       console.log(this);
      //     },
      //   };
      //   cat.eat();

      //构造函数内部this 指向的是实例化的对象
      //   function Cat(name, age) {
      //     this.name = name;
      //     this.age = age;
      //     console.log(this);
      //   }
      //   var a = new Cat("胖虎", 3);
      //   console.log(a);

      //   如果是事件内部，谁触发事件this就指向谁
      //   var oBtn = document.getElementById("btn");
      //   var oBtn = document.getElementsByTagName("button");
      //   //   console.log(oBtn.length);
      //   for (var i = 0; i < oBtn.length; i++) {
      //     oBtn[i].onclick = function () {
      //       console.log(this);
      //     };
      //   }
    </script>
  </body>
</html>
